var validator = {
	init: function(){
		//Try to get the filelist, if we do, call the showIMG
		var listDiv = document.getElementById("listDiv");
		if(listDiv){
			imageShow.init(listDiv);
		}
		
		var myForm = document.getElementById("form");
		if(myForm){
			var inputArray = myForm.getElementsByTagName("input");
		
			for (var i = 0; i < inputArray.length; i++) {
    		validator.createInteraction(inputArray, i);
        	}
		}

	},
	
	createInteraction: function(inputArray, nr){
    
        var validatorClass = inputArray[nr].getAttribute("class");
        
        inputArray[nr].onfocus = function(){
            validator.toolTip(validatorClass, this);
        };
    },
        
    toolTip: function(toolClass, that){
    	
    	var div = document.createElement("div");
		div.setAttribute("class", "tooltip");
		var text = document.createElement("p");
		var textInner= null;
		
		if (toolClass === "user") {
			textInner = document.createTextNode("a-z, A-Z, 0-9, must begin and end with a letter");
		}
		
		if (toolClass === "pass") {
			textInner = document.createTextNode("a-z, A-Z, 0-9, must begin and end with a letter");
		}
		
		if (toolClass === "email") {
			textInner = document.createTextNode("Enter a valid emailadress");
		}
		
		text.appendChild(textInner);
		div.appendChild(text);
		
		//Hitta textfältets kordinater
		var cords = [];
		cords = validator.findPos(that);
		
		//Tilldela diven kordinaterna
		div.style.position = "absolute";
		div.style.left = cords[0]+"px";
		div.style.top = cords[1]+"px";
		
		//Stoppa in diven i body
		document.getElementsByTagName("body")[0].appendChild(div);
		
		that.onblur = function(){
            document.getElementsByTagName("body")[0].removeChild(div);
        };
    },
	
	findPos: function(that){
		
			var curLeft = 0;
			var curTop = 0;
			
			if(that.offsetParent){
				
				do{
					curLeft += that.offsetLeft;
					curTop += that.offsetTop;
				}while (that === that.offsetParent);
			}
			return [curLeft,curTop];
	}
};

var imageShow = {

    init: function(listDiv){
    	
        var linkArray = listDiv.getElementsByTagName("a");
		for(var i = 0; i < linkArray.length; i++){
			linkArray[i].onclick = function(event){
				event.preventDefault();
				imageShow.ShowimgDiv(this);
				return false;
			};
		}     
	},
	
	ShowimgDiv: function(that){	
		var img = that.getElementsByTagName("img")[0];
		var backgroundDiv = document.createElement("div");
		var imgDiv = document.createElement("div");
		var closeLink = document.createElement("a");
		closeLink.innerHTML = "Close!";
		
		backgroundDiv.setAttribute("class", "backbroundDiv");
		imgDiv.setAttribute("class", "ShowimgDiv");
		closeLink.setAttribute("class", "closeLink");
		closeLink.setAttribute("href", "");

		imgDiv.appendChild(closeLink);
		imgDiv.appendChild(img);

		document.getElementsByTagName("body")[0].appendChild(backgroundDiv);
		document.getElementsByTagName("body")[0].appendChild(imgDiv);
		
	}
};
	
window.onload = validator.init;